{% extends 'xadmin/base.html' %}
{% load staticfiles %}
{% load node_tag %}

{% block title %}
    部件管理
{% endblock %}

{% block style %}
    <style>
         .hidden {
                display: none;
            }
         .editor{
             padding:0;
             overflow: hidden;

         }
        #edui1 {
            border: 1px solid #d4d4d4;
        }
    </style>

{% endblock %}

{% block main %}
    <div class="col-sm-10">
        <form method="POST" class="layui-form" action="" enctype="multipart/form-data">
            {% csrf_token %}
            <div class="tab-content">
                <div class="tab-pane active" id="basic-info"  style="margin:40px;">
                    {% for field in ele_form %}

                            <div class="layui-form-item">
                                <label class="layui-form-label" style="width: 125px;">{{ field.label }}</label>
                                <div class="layui-input-block" style="margin-left:160px;">
                                    {{ field }}
                                    <span class="help-block m-b-none">{{ field.errors }}</span>
                                </div>
                            </div>

                    {% endfor %}
                </div>
            </div>

            <div class="col-sm-4 col-sm-offset-2">
                <button class="btn btn-primary" type="submit">保存</button>
                <a class="btn btn-white" href="#" onclick="javascript:history.back(-1);">取消</a>
            </div>
        </form>
    </div>
{% endblock %}

{% block script %}
    <script src="{% static 'xadmin/ueditor/ueditor.config.js'%}"></script>
    <script src="{% static 'xadmin/ueditor/ueditor.all.js'%}"></script>
    <script>
        var f_filter = {
            'input': $('#id_input'),
            'text': $('#id_text'),
            'image': $('#id_image'),
            'file': $('#id_file'),
            'video': $('#id_video')
        };
        $(function(){
            //初次打开时隐藏内容字段
            $('input[t="hidden"]').each(function(){
                $(this).parents('.layui-form-item').addClass('hidden');
            });
            $('textarea[t="hidden"]').parents('.layui-form-item').addClass('hidden');

            //编辑时设置内容字段
            var ext = $('#id_etype').val();
            for(var key in f_filter){
                    if(ext == 'editor'){
                        ext = 'text';
                        var ue = UE.getEditor('id_text', {
                            'min-height': '800px',
                            autoFloatEnabled: true,
                            initialFrameWidth: '100%',
                            autoHeightEnabled: true,
                        });
                        $('#id_text').addClass('editor');
                    }
                    if(key == ext){
                        f_filter[key].parents('.layui-form-item').removeClass('hidden');
                    }else{
                        f_filter[key].parents('.layui-form-item').addClass('hidden');
                    }
                }

        });

        //监听select事件
        layui.use('form', function(){
            var form = layui.form;
            form.on('select', function(data){
              //console.log(data.elem); //得到select原始DOM对象
              //console.log(data.value); //得到被选中的值
              //console.log(data.othis); //得到美化后的DOM对象

                var t = data.value;
                for(var key in f_filter){
                    if(t == 'editor'){
                        t = 'text';
                        var ue = UE.getEditor('id_text', {
                            'min-height': '800px',
                            autoFloatEnabled: true,
                            initialFrameWidth: '100%',
                            autoHeightEnabled: true,
                        });
                        $('#id_text').addClass('editor');
                    }
                    if(key == t){
                        f_filter[key].parents('.layui-form-item').removeClass('hidden');
                    }else{
                        f_filter[key].parents('.layui-form-item').addClass('hidden');
                    }
                }
            });
        })
    </script>
{% endblock %}